<template>
  <mid-dialog-box class="myInvitationCode" @closeMidDialog="closeDialog" :title="'我的邀请码'">
    <img src="@/assets/home/myInvitationCode.png" alt="">
    <p class="invitationCode">{{ invitation_code }}</p>
    <p class="tips">复制邀请码分享给好友</p>
    <div class="btn-blue copy" @click="copyCode">复制邀请码</div>
  </mid-dialog-box>
</template>

<script>
export default {
  name: 'myInvitationCode',
  computed: {
    invitation_code () {
      return this.$store.state.user.userInfo.user_invitation_code
    }
  },
  methods: {
    closeDialog () {
      this.$emit('closeInvitationCode')
    },
    // 复制邀请链接
    copyCode () {
      this.tools.copyText(this.invitation_code)
    }
  }
}
</script>

<style scoped lang="scss">
.myInvitationCode {
  text-align: center;
  img {
    margin-top: 64px;
    width: 212px;
    height: 25px;
  }
  .invitationCode {
    font-size: 48px;
    color: #273533;
  }
  .tips {
    color: #8D99B0;
    font-size: 14px;
  }
  .copy {
    width: 136px;
    margin: 290px auto 0;
  }
}
</style>
